/*Global*/
a {
    text-decoration: none;
}

/*Container*/
.App-Container {
    height: 100%;
    display: flex;
    flex-flow: column nowrap;
}

/*Header*/
.Container-header {
    flex: 0 0 75px;
    display: flex;
    color: white;
    background: forestgreen;
    justify-content: center;
    align-items: center;
}

/*Body*/
.Container-body {
    flex: 1;
    display: flex;
    flex-flow: column nowrap;
}

/*Body - nav*/
.Container-body .App-nav-list {
    flex: 0 0 5%;
    display: flex;
    flex-flow: row nowrap;
    border-right: 1px solid gray;
    box-shadow: 3px 0 5px gray;
}

.Container-body .App-nav-list ul {
    list-style: none; /*清楚项目符号*/
    padding: 0; /*清除默认内边距*/
    margin: 0; /*清除默认外边距*/

    flex: 1;
    display: flex;
}

.Container-body .App-nav-list ul li {
    flex: 1;
    border-right: 1px dashed gray;
    cursor: pointer;
}

.Container-body .App-nav-list ul li a {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Container-body .App-nav-list ul li:last-child {
    border-right: none;
}

.Container-body .App-nav-list ul li:hover {
    background: greenyellow;
}

/*Body - content*/
.Container-body .content {
    flex: 1;
}